<template>

	<a-descriptions size="small">
		<template #title>
			<div class="d-module-title">
				<b>房源信息</b>
				<a-tag :color="dataSource.statusInfo.color" style="margin-left: 10px">{{ dataSource.statusInfo.name }}</a-tag>
			</div>
		</template>
		<a-descriptions-item label="房屋户型">{{ dataSource.house.layoutInfo }}</a-descriptions-item>
		<a-descriptions-item label="房屋面积">{{ dataSource.house.area || '' }}㎡</a-descriptions-item>
		<a-descriptions-item label="楼层信息">
			第
			{{ dataSource.house.currentFloor }}
			层，共
			{{ dataSource.house.totalFloor }}
			层
		</a-descriptions-item>
		<a-descriptions-item label="房源地址">{{ dataSource.house.houseAddress }}</a-descriptions-item>
		<a-descriptions-item label="可住人数">{{ dataSource.house.userlimit || '-' }} 人</a-descriptions-item>
	</a-descriptions>
	<template v-if="[11, 42].includes(dataSource.contractStatus)">
		<a-divider type="horizontal" style="background-color: #f5f5f5; margin: 20px 0" />
		<a-descriptions size="small">
			<template #title>
				<div class="d-module-title">
					<b>意向信息</b>
				</div>
			</template>
			<a-descriptions-item label="承租价格">{{ dataSource.price }}元/{{dataSource.contractRentType === 2? '日':'月'}}</a-descriptions-item>
			<a-descriptions-item label="押金">{{ dataSource.deposit }}元</a-descriptions-item>
			<a-descriptions-item label="付款方式">
				<span>押{{ dataSource.depositMonth }}</span>
				<span v-if="dataSource.periodMonth === 99">一次性付</span>
				<span v-else>付{{ dataSource.periodMonth }}</span>
			</a-descriptions-item>
			<a-descriptions-item label="合同周期">
				{{ formatDate(dataSource.beginTime) }}至{{ formatDate(dataSource.endTime) }}
			</a-descriptions-item>
		</a-descriptions>
	</template>
	<template v-if="![11, 42].includes(dataSource.contractStatus)">
		<a-divider type="horizontal" style="background-color: #f5f5f5; margin: 20px 0" />
		<a-descriptions size="small">
			<template #title>
				<div class="d-module-title">
					<b>合同信息</b>
					<!-- <a @click.stop="visibles.updateContract = true">
						<FormOutlined class="update-icon" />
						<a class="update-information">编辑合同信息</a>
					</a> -->
				</div>
			</template>
			<a-descriptions-item label="合同编号">{{ dataSource.contractNo }}</a-descriptions-item>
			<a-descriptions-item label="签约类型">
				<a-space>
					{{ dataSource.contractMedium === 1 ? '纸质' : '电子' }}
					<a
						class="download-code-text"
						v-if="dataSource.contractMedium === 2 && previewUrl"
						@click="preview"
						download="电子合同.pdf">
						预览
					</a>
					<a
						class="download-code-text"
						v-if="dataSource.contractMedium === 2 && previewUrl"
						:href="downloadUrl"
						target="_blank"
						download="电子合同.pdf">
						下载
					</a>
				</a-space>
			</a-descriptions-item>
			<a-descriptions-item label="合同类型">
				<span>
					业主合同
				</span>
			</a-descriptions-item>
			<a-descriptions-item label="成交方式">{{ signType[dataSource.signType] }}</a-descriptions-item>
			<a-descriptions-item label="合同周期">
				{{ formatDate(dataSource.beginTime) }}至{{ formatDate(dataSource.endTime) }}
			</a-descriptions-item>
			<a-descriptions-item label="承租价格">{{ dataSource.price || 0 }}元/{{dataSource.contractRentType === 2? '日':'月'}}</a-descriptions-item>
			<a-descriptions-item label="押金">{{ dataSource.deposit }}元</a-descriptions-item>
			<a-descriptions-item label="付款方式">
				<span>押{{ dataSource.depositMonth }}</span>
				<span v-if="dataSource.periodMonth === 99">一次性付</span>
				<span v-else>付{{ dataSource.periodMonth }}</span>
			</a-descriptions-item>
			<a-descriptions-item label="收租日设置">
				<template v-if="dataSource.payPattern === 1">提前{{ dataSource.payPatternValue }}天收租</template>
				<template v-else-if="dataSource.payPattern === 2">固定{{ dataSource.payPatternValue }}号收租(每期第一个月)</template>
				<template v-else>固定{{ dataSource.payPatternValue }}号收租(每期提前一个月)</template>
			</a-descriptions-item>
			<a-descriptions-item label="录入时间">{{ dataSource.createTime }}</a-descriptions-item>
			<a-descriptions-item label="免租期天数">
				<template v-if="dataSource.freeDays > 0">
					{{ dataSource.freeDays }}天
				</template>
				<template v-else>-</template>
			</a-descriptions-item>
			<a-descriptions-item label="补充说明">{{ dataSource.addExplanation || '-' }}</a-descriptions-item>
			<a-descriptions-item label="合同附件">
				<a @click="visibles.upload = true">查看附件</a>
				<!--<file-preview :biz-id="dataSource.id" />-->
			</a-descriptions-item>
		</a-descriptions>
	</template>

	<template>
		<a-divider type="horizontal" style="background-color: #f5f5f5; margin: 20px 0" />
		<a-descriptions size="small">
			<template #title>
				<div class="d-module-title">
					<b>签约信息</b>
				</div>
			</template>
			<a-descriptions-item label="签约部门">{{ dataSource.signDeptName }}</a-descriptions-item>
			<a-descriptions-item label="签约人">{{ dataSource.signEmpName }}</a-descriptions-item>
			<a-descriptions-item label="合同维护人">{{ dataSource.maintainerName }}</a-descriptions-item>
			<a-descriptions-item label="签约时间">{{ formatDate(dataSource.signTime) }}</a-descriptions-item>
		</a-descriptions>
	</template>

	<template v-if="[9, 5].includes(dataSource.contractStatus) && dataSource.cancelInfo">
		<a-divider type="horizontal" style="background-color: #f5f5f5; margin: 20px 0" />
		<a-descriptions size="small">
			<template #title>
				<div class="d-module-title">
					<b>退租信息</b>
				</div>
			</template>
			<a-descriptions-item label="退租日期" :span="1">{{ formatDate(dataSource.quiteDate) }}</a-descriptions-item>
			<a-descriptions-item label="处理人" :span="1">{{ dataSource.cancelInfo.rejectName }}</a-descriptions-item>
			<a-descriptions-item label="处理时间" :span="1">{{ dataSource.cancelInfo.rejectTime }}</a-descriptions-item>
			<a-descriptions-item label="退租原因" :span="3">{{ dataSource.cancelInfo.reason }}</a-descriptions-item>
		</a-descriptions>
	</template>
	<template v-if="[6].includes(dataSource.contractStatus) && dataSource.rejectReason">
		<a-divider type="horizontal" style="background-color: #f5f5f5; margin: 20px 0" />
		<a-descriptions size="small">
			<template #title>
				<div class="d-module-title">
					<b>作废信息</b>
				</div>
			</template>
			<a-descriptions-item label="作废人">{{ dataSource.rejectReason.rejectName + '-' + dataSource.rejectReason.rejectPhone }}</a-descriptions-item>
			<a-descriptions-item label="作废时间">{{ dataSource.rejectReason.rejectTime }}</a-descriptions-item>
			<!-- <a-descriptions-item label="作废原因">{{ dataSource.rejectReason.reason }}</a-descriptions-item> -->
		</a-descriptions>
	</template>
	<!-- <template v-if="[42].includes(dataSource.contractStatus) && dataSource.rejectReason">
		<a-divider type="horizontal" style="background-color: #f5f5f5; margin: 20px 0" />
		<a-descriptions size="small">
			<template #title>
				<div class="d-module-title">
					<b>拒绝信息</b>
				</div>
			</template>
			<a-descriptions-item label="拒绝人">{{ dataSource.rejectReason.rejectName }}</a-descriptions-item>
			<a-descriptions-item label="拒绝时间">{{ dataSource.rejectReason.rejectTime }}</a-descriptions-item>
			<a-descriptions-item label="拒绝原因">{{ dataSource.rejectReason.reason }}</a-descriptions-item>
		</a-descriptions>
	</template> -->
	<file-upload-dialog
		v-model:visible="visibles.upload"
		:biz-id="dataSource.id"
		:isDetails="[1, '1',2,'2',4,'4'].includes(props.approvalStatus as number)" />

	<copy-url v-model:visible="visibles.showCopyUrl" :url="supplementSignUrl" />
	<update-contract v-model:visible="visibles.updateContract" :dataSource="props.dataSource"></update-contract>
</template>

<script setup lang="ts">
	import {reactive, ref, createVNode, onMounted} from 'vue'
	import FileUploadDialog from '@/components/common/file-upload-dialog.vue'
	import {formatDate} from 'yuxin-base/src/utils/date'
	import {signPreviewUrl, signFileDownloadUrl, getSupplementExecuteUrl, getSupplementPreview, downloadSupplement} from '@/api/contract'
	import {discountTypeMap} from '@/constant/enterprise-customers'
	import dialogs from '@/micros/dialogs'
	// import addSupplementDialog from './add-supplement-contract.vue'
	import {PlusCircleOutlined, ExclamationCircleOutlined} from '@ant-design/icons-vue'
	import {Modal} from 'ant-design-vue'
	// import CopyUrl from './copy-url.vue'

	const emits = defineEmits(['success'])
	const props = defineProps<{
		dataSource: any
		approvalStatus?: number | null | string
	}>()

	const visibles = reactive({
		upload: false,
		addSupplement: false,
		showCopyUrl: false,
		// 编辑合同信息
		updateContract: false
	})
	const isDetails = ref(false)
	const preview = isSupplement => {
		if ('supplement' === isSupplement) {
			window.open(supplementPreviewUrl.value, '_blank')
		} else {
			window.open(previewUrl.value, '_blank')
		}
	}
	const previewUrl = ref('')
	const supplementPreviewUrl = ref('')
	const getSignPreviewUrl = () => {
		signPreviewUrl({clientType: 'PC', signChannel:1,contractId: props.dataSource.id}).then(res => {
			previewUrl.value = res.data
		})
	}
	// 获取补充合同预览
	const getSupplementPreviewUrl = () => {
		getSupplementPreview({
			clientType: 'PC',
			contractId: props.dataSource.id,
			supplementId: props.dataSource.renterContractSupplementDTOList[0].id
		}).then(res => {
			supplementPreviewUrl.value = res.data
		})
	}
	const downloadUrl = ref('')
	const supplementDownloadUrl = ref('')
	const supplementSignUrl = ref('')
	const getSignFileDownloadUrl = () => {
		signFileDownloadUrl(props.dataSource.id).then(res => {
			downloadUrl.value = res.data[0]
		})
	}
	const getSupplementDownloadUrl = () => {
		downloadSupplement(props.dataSource.renterContractSupplementDTOList[0].id).then(res => {
			supplementDownloadUrl.value = res.data[0]
		})
	}
	onMounted(() => {
		if (props.dataSource.id && props.dataSource.contractMedium === 2 && props.dataSource?.econtractModelId) {
			getSignPreviewUrl()
			getSignFileDownloadUrl()
		}
		if (
			props.dataSource.id &&
			props.dataSource.renterContractSupplementDTOList &&
			props.dataSource.renterContractSupplementDTOList.length
		) {
			const isBestSign = props.dataSource.authType === 2 &&  (props.dataSource.renterContractSupplementDTOList ||[]).some(e=>e.signStatus === 2)
			const shouldRender = props.dataSource.authType !== 2 ||  isBestSign
			shouldRender && getSupplementPreviewUrl()
			shouldRender && getSupplementDownloadUrl()
		}
	})
	const signType: {
		[key: string | number]: any
	} = {1: '新签', 2: '续签', 3: '转租', 4: '换房'}
	const activitySignType: {
		[key: string | number]: any
	} = {null: '不限制', 1: '仅新签', 2: '仅续签'}

</script>

<style lang="less" scoped>
	:deep(.ant-descriptions-item-label) {
		color: rgba(0, 0, 0, 0.45);
	}
	.update-icon {
		margin-left: 10px;
	}
	.update-information {
		margin: 3px 0 0 3px;
		font-size: 13px;
	}
</style>
